<template>
    <div style="text-align: -webkit-center;">
        <el-form ref="dataForm">
            <el-form-item label="账号" style="width: 800px;">
                <el-input v-model.trim="account" id="2"/>
            </el-form-item>
            <el-form-item label="密码" style="width: 800px;">
                <el-input v-model.trim="password" id="3"/>
            </el-form-item>
            <el-form-item style="width: 800px;">
                <el-button type="primary" @click="submit()">确定注册</el-button>
            </el-form-item>
            <el-form-item style="width: 800px;">
                <el-button type="primary" @click="back()">返回登录</el-button>
            </el-form-item>
        </el-form>
    </div>
</template>
<script>
    import {postRequestBody} from "../utils/api";
    export default {
        name: 'Register',
        data() {
            return {
                account: '',
                password: '',
                msg: ''
            }
        },
        methods: {
            back() {
                this.$router.replace({path: '/'});
            },
            submit() {
                let newAccount = document.getElementById('2').value;
                let newPassword = document.getElementById('3').value;
                    postRequestBody("/system/user", {
                        account: newAccount,
                        password: newPassword,
                        identity: "普通用户",
                    }).then(resp => {
                        if (resp.data.code == 200) {
                            console.log(resp.data);
                            this.$router.replace({path: '/'});
                            this.$alert('注册成功！请返回登录');
                        }
                        else {
                            this.$message({
                                type: "error",
                                message:
                                    resp.data.msg == null
                                        ? "更新信息失败，请联系管理员！"
                                        : resp.data.msg,
                            });
                        }
                    }, resp => {
                        this.$message({type: 'error', message: '数据加载失败!'});
                    });
            }
        }
    }
</script>
<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
</style>
